<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>位置</title>
      <link rel="stylesheet" type="text/css" href="__CSS__/api.css"/>
      <link rel="stylesheet" type="text/css" href="__CSS__/tt.css"/>

      <style>
          body{
            width:100%;
            height:100%;
            margin:0;
            padding:0;
            background-color: #fff;
          }
          /*头部*/
          .top{
            height: 60px;
            width: 100%;
          }
          .top_box{
            width: 1200px;
            height: 100%;
            margin: 0 auto;
            align-items: center;

          }
          .top_name_left{
            width:38px;
            height:38px;
            /*background:rgba(52,99,230,1);*/
            background: url('__IMG__/logo.png') no-repeat center center;
            background-size:100% 100%;
            /*width: 50px;height: 50px;*/
            border-radius:10px;
            margin-right: 10px;
          }
          .top_name{
            height:60px;
            font-size:24px;
            font-family:PingFangSC-Medium;
            font-weight:500;
            line-height:60px;
            color:rgba(52,99,230,1);
          }
          /*头部*/
          .outer{
            width: 1200px;
            margin: 0 auto;
          }
          /*热门城市*/
          .hot_city{
            height: 100px;
            width: 100%;
            line-height: 100px;
          }
          .hot_city span{
            font-size:16px;
            font-family:PingFangSC-Regular;
            font-weight:400;
            color:rgba(51,51,51,1);
            margin-right: 22px;
          }
          .hot_city span:first-child{
            font-family:PingFangSC-Medium;
            font-weight:500;
          }
            /*热门城市*/

            /*城市列表*/
            .city_li{
              width:1198px;
              background:rgba(255,255,255,1);
              border-radius:4px;
              border:1px solid rgba(237,237,237,1);
              margin-bottom: 20px;
            }
            .city_li_row{
              width:100%;
              border-bottom:1px solid rgba(237,237,237,1);
            }
            .city_li_row:last-child{
                border-bottom:none;
            }
            .city_li_row_a{
              width: 64px;
              font-size:26px;
              font-family:PingFangSC-Semibold;
              font-weight:600;
              color:rgba(176,179,186,1);
              text-align: center;
              background:rgba(248,248,249,1);
              display: flex;
              align-items: center;
              justify-content: center;
            }
            .city_li_row_a_active{
              background:rgba(52,99,230,1);
              color: #fff;
              position: relative;
            }
            .city_li_row_a_active::after{
              content: ' ';
              height: 16px;
              width: 16px;
              position: absolute;
              right: -10px;
              top: calc(50% - 8px);
              background: url('__IMG__/sanjiao.png') no-repeat center center;
              background-size:16px 16px;
            }
            .city_li_row_outer_active{
              background:rgba(248,248,248,1);
            }
            .city_li_row_ather_active{
              color:rgba(52,99,230,1);
            }
            .city_li_row_ather{
              font-size:14px;
              font-family:PingFangSC-Regular;
              font-weight:400;
              color:rgba(16,28,55,1);
              line-height:60px;
            }
            .city_li_row_ather span{
              margin-right: 20px;
              /*！！！！！！！！！！！！！！！这个是新加的！！！！！！！！！！！！！*/
              padding-left: 10px;
            }
            /*.city_li_row_ather span:first-child{*/
              /*margin:0 40px;*/
              /*font-size:18px;*/
              /*font-family:PingFangSC-Semibold;*/
              /*font-weight:600;*/
              /*color:rgba(16,28,55,1);*/
            /*}*/
              /*城市列表*/
          .shou{
              cursor: pointer;
          }
      </style>
  </head>
  <body>
    <div class="top">
      <div class="top_box flex-wrap">
        <div class="top_name_left" style="cursor: pointer" onclick="location.href='{:url('home/Index/index')}'"></div>
        <div class="top_name" style="cursor: pointer" onclick="location.href='{:url('home/Index/index')}'">
          置家优选
        </div>
      </div>
    </div>


<div class="outer">
  <div class="hot_city">
      <span>热门城市：</span>
    {volist name='hot' id='h'}
      <span data-id="{$h.district_id}" class="shou">{$h.district}</span>
    {/volist}
  </div>


  <div class="city_li">
    {volist name='data' id='d'}
    <div class="city_li_row flex-wrap">
      <div class="city_li_row_a {if $d[0]['me'] == 2}city_li_row_a_active{/if}">
        {$key}
      </div>
      <div class="city_li_row_outer flex-con {if $d[0]['me'] == 2}city_li_row_outer_active{/if}">
        <div class="city_li_row_ather">
          {volist name="$d" id='d2'}
          <span data-id="{$d2.id}" class="shou {if $Think.session.my_location_city_id == $d2.id} city_li_row_ather_active {/if}">{$d2.name}</span>
          {/volist}
        </div>
      </div>
    </div>
    {/volist}
    <!--<div class="city_li_row flex-wrap">-->
      <!--<div class="city_li_row_a city_li_row_a_active" >-->
        <!--B-->
      <!--</div>-->
      <!--<div class="city_li_row_outer flex-con city_li_row_outer_active">-->
        <!--<div class="city_li_row_ather">-->
          <!--<span>北京</span>-->
          <!--<span class="city_li_row_ather_active">北京</span>-->
        <!--</div>-->
      <!--</div>-->
    <!--</div>-->
    <!--<div class="city_li_row flex-wrap">-->
      <!--<div class="city_li_row_a">-->
        <!--C-->
      <!--</div>-->
      <!--<div class="city_li_row_outer flex-con">-->
        <!--<div class="city_li_row_ather">-->
          <!--<span>重庆</span>-->
          <!--<span>重庆</span>-->
        <!--</div>-->
      <!--</div>-->
    <!--</div>-->
    <!--<div class="city_li_row flex-wrap">-->
      <!--<div class="city_li_row_a">-->
        <!--F-->
      <!--</div>-->
      <!--<div class="city_li_row_outer flex-con">-->
        <!--<div class="city_li_row_ather">-->
          <!--<span>福建</span>-->
          <!--<span>福建</span>-->
          <!--<span>龙岩</span>-->
          <!--<span>泉州</span>-->
          <!--<span>厦门</span>-->
          <!--<span>漳州</span>-->
        <!--</div>-->
      <!--</div>-->
    <!--</div>-->
    <!--<div class="city_li_row flex-wrap">-->
      <!--<div class="city_li_row_a">-->
        <!--G-->
      <!--</div>-->
      <!--<div class="city_li_row_outer flex-con">-->
        <!--<div class="city_li_row_ather">-->
          <!--<span>广东</span>-->
          <!--<span>福建</span>-->
          <!--<span>龙岩</span>-->
          <!--<span>泉州</span>-->
          <!--<span>厦门</span>-->
          <!--<span>漳州</span>-->
        <!--</div>-->
        <!--<div class="city_li_row_ather">-->
          <!--<span>广东</span>-->
          <!--<span>福建</span>-->
          <!--<span>龙岩</span>-->
          <!--<span>泉州</span>-->
          <!--<span>厦门</span>-->
          <!--<span>漳州</span>-->
        <!--</div>-->
      <!--</div>-->
    <!--</div>-->



  </div>
</div>


  </body>
  <script src="/static/admin/js/jquery.min.js"></script>
  <script type="text/javascript">
      $('.shou').click(function () {
          var did = $(this).attr('data-id');
          var ddd = $(this).text();
          window.location.href = '/home/Index/index?did='+did+'&ddd='+ddd;
      });
  </script>
  </html>
